<template>
    <div>
        <section class="content">
            <p>
                <span>面试地址：</span>
                <span>北京市朝阳区东三环中路1号渣打大厦8层</span>
            </p>
            <p>
                <span>面试时间：</span>
                <span>2020-05-11 23:00</span>
            </p>
            <p>
                <span>联系方式：</span>
                <span>15555555555</span>
            </p>
            <p>
                <span>是否提醒：</span>
                <span>未提醒</span>
            </p>
            <p>
                <span>面试状态：</span>
                <span>未开始</span>
            </p>
            <p>
                <span>取消提醒：</span>
                <span>未开始</span>
            </p>
        </section>
        <footer>
            <button>去打卡</button>
            <button>放弃面试</button>
        </footer>
    </div>
</template>

<style lang="scss" scoped>
    .content{
        padding: 0 20rpx;
        p{
            width: 100%;
            height: 90rpx;
            display: flex;
            span{
                color: gray;
                font-size: 32rpx;
                line-height: 90rpx;
                &:nth-child(1){
                    flex: 2.5;
                    text-align: center
                }
                &:nth-child(2){
                    flex: 7.5;
                    color: #666;
                    font-weight: 600
                }
            }
            border-bottom: 1px solid #ddd;
            &:nth-child(1),&:nth-child(3){
                span:last-child{
                    color: rgb(13, 182, 89)
                }
            }
            &:nth-child(1){
                span:last-child{
                    line-height:normal;
                }
            }
        }
    }
    footer{
        margin-top: 60rpx;
        button{
            width: 45%;
            height: 70rpx;
            line-height: 70rpx;
            font-size: 36rpx;
            background: blue;
            color: #fff;
            border-radius: 10rpx;
            margin-left: 20rpx;
            display: inline-block;
            &:nth-child(2){
                background: red;
            }
        }
    }
</style>